<template>
  <div>
    <button @click="sayHello">提交</button>
    <div v-for="person in persons" :key="person.id">{{ person.name }}</div>
    <div class="btn-size">
      <nut-button size="big">大号按钮</nut-button>
      <nut-button size="middle">中号按钮</nut-button>
      <nut-button size="small" @click="haha">小号按钮</nut-button>
    </div>
    <nut-rate v-model="value" />
  </div>
</template>
<script>
  export default {
    name: 'Caodan',
    components: {},
    beforeCreate() {
      console.log('beforeCreate');
    },
    data() {
      return {
        show: false,
        value: 3,
        msg: '你好，世界',
        persons: [
          {
            id: 1,
            name: 'caodan',
            age: 20,
          },
          {
            id: 2,
            name: 'cao',
            age: 20,
          },
        ],
      };
    },
    methods: {
      sayHello() {
        console.log(this.msg);
      },
      haha() {
        console.log('haha');
      },
    },
  };
</script>
<style lang="scss" scoped></style>
